/** @jsxImportSource @emotion/react */
import {render检验时间, render设备类别} from "../../common/render";
import {CCell, Cell, Table, TableBody, TableHead, TableRow, Text} from "customize-easy-ui-component";
import {DirectLink} from "../../../routing/Link";
import * as React from "react";
import {RepLink} from "../../common/base";
import {useJudgmentTable, useJudgmentTableX} from "../../hook/useJudgment";
import {useThreeColumnView} from "../../hook/useThreeColumnSubr";

//无需校验存储唯一性
export const config报告设备 = [
  [['制造单位名称', '_$制造单位'] ],
  [['制造单位住所', '_$制造单位地址' ] ],
    //申请单位=使用单位
  [['申请单位名称', '_$使用单位'],  ],
  [['申请单位住所', '_$使用单位地址'],  ],
  [['设备类别(品种)', '_$设备类别',render设备类别], ['产品名称', '_$设备名称'], ],
  [['产品型号', '_$型号'], ['产品编号', '_$出厂编号'], ],
    //结论页录入的 接受日；
  [['样机制造日期', '_$制造日期'], ['样机接受日期', '_$接受日'] ],
  [['总图图号', '_$总图号'], ],
  [['试验时间', '_$检验日期', render检验时间],  ],
  [['样机制造地址', '_$制造地'] ],
  [['试验地点', '_$试验地点'] ],
];

/**机电用的 ：项目表的附角 人员
 * */
export const FootFlexMenBar= ({orc, rep,children,cap,scap}: { orc: any, rep: any, children?: any,cap?:string,scap?:string}
) => {
  // const theme = useTheme();
  return <>
    <Table fixed={["6%", "58%", "%"]} css={{borderCollapse: 'collapse',"@media print": {pageBreakInside: 'avoid'}}}>
      <TableBody>
        <RepLink ori rep={rep} tag={'Conclusion'}>
          <TableRow>
            <CCell colSpan={2} css={{height: 'inherit'}}>
              <div css={{
                height: '100%',
                display: 'flex',
                flexDirection: 'column',
                justifyContent: 'space-between',
                alignContent: 'space-between',
                alignItems: 'flex-start'
              }}>
                <div><Text>{cap??'检验人员'}：</Text></div>
                <div css={{width: '100%', textAlign: 'end'}}><Text>日期：</Text>2022-12-31</div>
              </div>
            </CCell>
            <CCell css={{height: 'inherit'}}>
              <div css={{
                height: '100%',
                display: 'flex',
                flexDirection: 'column',
                justifyContent: 'space-between',
                alignContent: 'space-between',
                alignItems: 'flex-start'
              }}>
                <div><Text>{scap??'校核人员'}：</Text></div>
                <div css={{width: '100%', textAlign: 'end'}}><Text>日期：</Text>2021-01-31</div>
              </div>
            </CCell>
          </TableRow>
        </RepLink>
      </TableBody>
    </Table>
  </>;
};

//【测量表】需拆分成三个编辑器的情况：测量表项目太多；Measure Measure2 Measure3路由标签
export const Measure3PartVw= ({ orc, rep,label,config1,config2,config3,children,fixed=["4%","3%","%","13%","21%","5.5%","12%","10%","8%"],tag='Measure',
                                 nseq,crit, mem, xcls=3, tail} :
                                   { orc: any, rep: any,label:string,config1:any,config2:any,config3:any,children?:any,fixed?:string[],tag?:string,
                                     nseq?:boolean,crit?:boolean,mem?: string,xcls?:number, tail?:any}
) => {
  const {rows: render1,seq}=useJudgmentTableX({rep,orc, config:config1});
  const {rows: render2,seq:seq2}=useJudgmentTableX({rep,orc, config:config2,seqOfs:seq});
  const render3=useJudgmentTable({rep,orc, config:config3,seqOfs:seq2});
  return <>
    <Text variant="h4" css={{marginTop: '1rem',
    }}>{label}</Text>
    <Table id={tag} fixed={ fixed }  css={ {borderCollapse: 'collapse' } } tight  miniw={800}>
      <TableHead>
        <TableRow>
          <CCell><Text css={{fontSize:'0.8rem'}}>序号</Text></CCell><CCell colSpan={2}><Text css={{fontSize:'0.7rem'}}>项目</Text></CCell>
          <CCell colSpan={2}>检验内容与要求</CCell><CCell>单位</CCell>
          <CCell>测量值</CCell><CCell>测量结果</CCell><CCell><Text css={{fontSize:'0.8rem'}}>结果判定</Text></CCell>
        </TableRow>
      </TableHead>
      <TableBody>
        <DirectLink  href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/Measure?original=1#Measure`}>
          {render1}
        </DirectLink>
        <DirectLink id={'Measure2'}  href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/Measure2?original=1#Measure`}>
          {render2}
        </DirectLink>
        <DirectLink id={'Measure3'}  href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/Measure3?original=1#Measure`}>
          {render3}
        </DirectLink>
      </TableBody>
    </Table>
    { tail }
  </>;
};

export const 报告设备详情= ( {orc, rep, config,}: { orc: any,rep:any, config:any[],}
) => {
      // const renderUpper=usePrefixDataTable({config: config设备上, orc, rep, slash:true});
  const [firstPart,_s]=useThreeColumnView({orc, config,slash:true,});
  return <React.Fragment>
    <Table id={'Survey'} fixed={ ["13.5%","30%","9%","12.2%","12%","%"] }
                    css={ {borderCollapse: 'collapse' } }  tight  miniw={800}>
      <TableBody>
        <RepLink rep={rep} tag={'Survey'}>
          {firstPart}
        </RepLink>
      </TableBody>
    </Table>
    <Table id={'Survey'} fixed={ ["8%","%"] } css={ {borderCollapse: 'collapse' } }  tight  miniw={800}>
      <TableBody>
        <TableRow>
          <CCell colSpan={1}>试验依据</CCell>
          <CCell>《场(厂)内专用机动车辆安全技术规程》(TSG 81—2022)</CCell>
        </TableRow>
        <RepLink rep={rep} tag={'Conclusion'}>
          <TableRow>
            <CCell>试验结论</CCell><CCell>
              <div css={{minHeight: '4rem', whiteSpace: 'pre-wrap',alignContent: 'center'}}>
                <Text variant="h1" css={{fontSize: '1.4rem',}}>{orc?.检验结论}</Text>
              </div>
            </CCell>
          </TableRow>
          <TableRow>
            <CCell>备注</CCell>
            <Cell>
              <div css={{minHeight: '3rem', whiteSpace: 'pre-wrap'}}>
              {orc?.结论备注  ?? '／'}
            </div></Cell>
          </TableRow>
        </RepLink>
      </TableBody>
    </Table>
  </React.Fragment>;
};
